<template>
  <view class="page">
    <view class="header"> </view>
    <view class="body">
      <u-input
        placeholder="登录账号"
        border="bottom"
        maxlength="16"
        v-model="editForm.account"
        prefix-icon="account"
        :prefix-icon-style="{
          color: '#979797',
        }"
        clearable
      />
      <u-gap />
      <u-input
        placeholder="登录密码"
        border="bottom"
        v-model="editForm.password"
        maxlength="16"
        prefix-icon="lock"
        :prefix-icon-style="{
          color: '#979797',
        }"
        clearable
        password
      />
    </view>
    <view class="body">
      <u-checkbox-group v-model="isPass" shape="circle" placement="row">
        <u-checkbox active-color="#4497FB" :name="true" />
        <text style="text-size: 20rpx; color: #979797">登录即代表您已阅读并同意</text>
        <text style="text-size: 20rpx; color: #4497fb" @click="handleTo">
          《用户服务协议》
        </text>
      </u-checkbox-group>
    </view>
    <view class="body">
      <u-button
        type="primary"
        shape="circle"
        text="登录"
        :throttleTime="1000"
        @click="handleSubmit"
      />
    </view>
  </view>
</template>

<script>
import { userLogin } from "@/request/api.js";
export default {
  data() {
    return {
      isPass: false, // 是否同意
      editForm: {
        account: "", // 账号
        password: "", // 密码
      },
    };
  },
  methods: {
    // 跳转协议
    handleTo() {
      uni.navigateTo({
        url: "/pages/protocol/index",
      });
    },
    // 登录
    handleSubmit() {
      if (!this.editForm.account) {
        uni.showToast({
          title: "账号不能为空",
          icon: "none",
        });
        return;
      }
      if (!this.editForm.password) {
        uni.showToast({
          title: "密码不能为空",
          icon: "none",
        });
        return;
      }
      if (!this.isPass || this.isPass.length == 0) {
        uni.showToast({
          title: "请先勾选协议",
          icon: "none",
        });
        return;
      }
      userLogin(this.editForm).then((res) => {
        if (res.code == 1) {
          uni.showToast({
            title: "登录成功",
            icon: "success",
            mask: true,
            success: () => {
              uni.setStorageSync("USER_INFO", JSON.stringify(res.data.userinfo));
              let token = res.data.userinfo.token;
              uni.setStorageSync("TOKEN", token);
              setTimeout(() => {
                uni.reLaunch({
                  url: "/pages/record/index",
                });
              }, 2000);
            },
          });
        }
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.page {
  width: 100vw;
  height: 100vh;
  .header {
    padding: 40rpx;
    display: flex;
    justify-content: center;
  }
  .body {
    padding: 40rpx;
  }
}
</style>
